[#ftl]
[@define "agile.BoxStyleEditor","agile._XMetadataEditor"]	
	[#assign templateString]
	<table cellspacing="5px" style="margin:0px">
	<tr>
		<td title="{i18n_position_tooltip}" class="tooltip">{i18n_position}</td>
		[#--<td><div data-dojo-type='agile.NumberComboBox' class="peditor" options="absolute,fixed,relative,static" width="80px" placeHolder="" name="position" htmlName="position"></div></td>--]
		<td><div data-dojo-type='agile.NumberComboBox' class="peditor" options="0" unit="px" placeHolder="left" name="left" htmlName="left" title="{i18n_left_tooltip}" class="tooltip"></div></td>		
		<td><div data-dojo-type='agile.NumberComboBox' class="peditor" options="0" unit="px" placeHolder="top" name="top" htmlName="top" title="{i18n_top_tooltip}" class="tooltip"></div></td>
		<td><div data-dojo-type='agile.NumberComboBox' class="peditor" options="0" unit="px" placeHolder="right" name="right" htmlName="right" title="{i18n_right_tooltip}" class="tooltip"></div></td>								
		<td><div data-dojo-type='agile.NumberComboBox' class="peditor" options="0" unit="px" placeHolder="bottom" name="bottom" htmlName="bottom" title="{i18n_bottom_tooltip}" class="tooltip"></div></td>
		<td></td>
		<td></td>
	</tr>
	<tr>
		<td title="{i18n_padding_tooltip}" class="tooltip">{i18n_padding}</td>
		<td><div data-dojo-type='agile.NumberComboBox' class="peditor" regExp="^(\s*|[0-9]+(px)?|0.[0-9]+|[0-9]+%)$" unit="px" placeHolder="top" name="paddingTop" htmlName="padding-top" title="{i18n_top_padding_tooltip}" class="tooltip"></div></td>
		<td><div data-dojo-type='agile.NumberComboBox' class="peditor" regExp="^(\s*|[0-9]+(px)?|0.[0-9]+|[0-9]+%)$" unit="px" placeHolder="right" name="paddingRight" htmlName="padding-right" title="{i18n_right_padding_tooltip}" class="tooltip"></div></td>
		<td><div data-dojo-type='agile.NumberComboBox' class="peditor" regExp="^(\s*|[0-9]+(px)?|0.[0-9]+|[0-9]+%)$" unit="px" placeHolder="bottom" name="paddingBottom" htmlName="padding-bottom" title="{i18n_bottom_padding_tooltip}" class="tooltip"></div></td>
		<td><div data-dojo-type='agile.NumberComboBox' class="peditor" regExp="^(\s*|[0-9]+(px)?|0.[0-9]+|[0-9]+%)$" unit="px" placeHolder="left" name="paddingLeft" htmlName="padding-left" title="{i18n_left_padding_tooltip}" class="tooltip"></div></td>
		<td></td>
		<td></td>
	</tr>
	<tr>
		<td title="{i18n_margin_tooltip}" class="tooltip">{i18n_margin}</td>
		<td><div data-dojo-type='agile.NumberComboBox' class="peditor" regExp="^(\s*|[0-9]+(px)?|0.[0-9]+|[0-9]+%)$" unit="px" placeHolder="top" name="marginTop" htmlName="margin-top" title="{i18n_top_margin_tooltip}" class="tooltip"></div></td>
		<td><div data-dojo-type='agile.NumberComboBox' class="peditor" regExp="^(\s*|[0-9]+(px)?|0.[0-9]+|[0-9]+%)$" unit="px" placeHolder="right" name="marginRight" htmlName="margin-right" title="{i18n_right_margin_tooltip}" class="tooltip"></div></td>
		<td><div data-dojo-type='agile.NumberComboBox' class="peditor" regExp="^(\s*|[0-9]+(px)?|0.[0-9]+|[0-9]+%)$" unit="px" placeHolder="bottom" name="marginBottom" htmlName="margin-bottom" title="{i18n_bottom_margin_tooltip}" class="tooltip"></div></td>
		<td><div data-dojo-type='agile.NumberComboBox' class="peditor" regExp="^(\s*|[0-9]+(px)?|0.[0-9]+|[0-9]+%)$" unit="px" placeHolder="left" name="marginLeft" htmlName="margin-left" title="{i18n_left_margin_tooltip}" class="tooltip"></div></td>
		<td></td>
		<td></td>
	</tr>	
	<tr>
		<td title="{i18n_width_tooltip}" class="tooltip">{i18n_width}</td>				
		<td><div data-dojo-type='agile.NumberComboBox' class="peditor" regExp="^(\s*|[0-9]+(px)?|0.[0-9]+|[0-9]+%)$" unit="px" placeHolder="width" name="width" htmlName="width" title="{i18n_width_tooltip}" class="tooltip"></div></td>				
		<td><div data-dojo-type='agile.NumberComboBox' class="peditor" options="0" unit="px" placeHolder="min width" name="minWidth" htmlName="min-width" title="{i18n_min_width_tooltip}" class="tooltip"></div></td>
		<td><div data-dojo-type='agile.NumberComboBox' class="peditor" options="0" unit="px" placeHolder="max width" name="maxWidth" htmlName="max-width" title="{i18n_max_width_tooltip}" class="tooltip"></div></td>
		<td valign="top" colspan="3" rowspan="5" style="width:180px">
		 	<div width="120px" data-dojo-type='agile.ClassEditor' class="peditor"></div>
	 	</td>
	</tr>			
	<tr>
		<td title="{i18n_height_tooltip}" class="tooltip">{i18n_height}</td>
		<td><div data-dojo-type='agile.NumberComboBox' class="peditor" regExp="^(\s*|[0-9]+(px)?|0.[0-9]+|[0-9]+%)$" unit="px" placeHolder="height" name="height" htmlName="height" title="{i18n_height_tooltip}" class="tooltip"></div></td>
		<td><div data-dojo-type='agile.NumberComboBox' class="peditor" options="0" unit="px" placeHolder="min height" name="minHeight" htmlName="min-height" title="{i18n_min_height_tooltip}" class="tooltip"></div></td>
		<td><div data-dojo-type='agile.NumberComboBox' class="peditor" options="0" unit="px" placeHolder="max height" name="maxHeight" htmlName="max-height" title="{i18n_max_height_tooltip}" class="tooltip"></div></td>
	</tr>
		
	<tr>
		<td title="{i18n_display_tooltip}" class="tooltip">{i18n_display}</td>
		<td><div data-dojo-type='agile.NumberComboBox' class="peditor" options="none,block,inline,inline-block,list-item,run-in,table,inline-table,table-row-group,table-header-group,table-footer-group,table-row,table-column-group,table-column,table-cell,table-caption" defValue="" placeHolder="" name="display" htmlName="display"></div></td>
		<td title="{i18n_visibility_tooltip}" class="tooltip">{i18n_visibility}</td>
		<td><div data-dojo-type='agile.NumberComboBox' class="peditor" options="visible,hidden,collapse" defValue="" placeHolder="" name="visibility" htmlName="visibility"></div></td>
	</tr>			
	<tr>
		<td title="{i18n_float_tooltip}" class="tooltip">{i18n_float}</td>
		<td><div data-dojo-type='agile.NumberComboBox' class="peditor" options="none,left,right" defValue="" placeHolder="" name="float" htmlName="float"></div></td>
		<td title="{i18n_clear_tooltip}" class="tooltip">{i18n_clear}</td>
		<td><div data-dojo-type='agile.NumberComboBox' class="peditor" options="none,left,right,both" defValue="" placeHolder="" name="clear" htmlName="clear"></div></td>
	</tr>
	<tr>
		<td title="{i18n_overflow_tooltip}" class="tooltip">{i18n_overflow}</td>
		<td><div data-dojo-type='agile.NumberComboBox' class="peditor" options="visible,hidden,scroll,auto"  name="overflow" htmlName="overflow"></div></td>
		<td title="{i18n_opacity_tooltip}" class="tooltip">{i18n_opacity}</td>					
		<td>
			<div data-dojo-type='agile.NumberComboBox' regExp="^(\s*|0|1|0.[1-9][0-9]*)$"  decimal2Percentage="false" class="peditor" name="opacity" htmlName="opacity" placeHolder="opacity"></div>
		</td>
	</tr>
	<tr>
		<td title="{i18n_overflow_x_tooltip}" class="tooltip">{i18n_overflow_x}</td>
		<td><div data-dojo-type='agile.NumberComboBox' class="peditor" options="visible,hidden,scroll,auto,no-display,no-content" name="overflowX" htmlName="overflow-x"></div></td>
		
		<td title="{i18n_cursor_tooltip}" class="tooltip">{i18n_cursor}</td>
		<td><div data-dojo-type='agile.NumberComboBox' class="peditor" options="auto,crosshair,pointer,move,e-resize,ne-resize,nw-resize,n-resize,se-resize,sw-resize,s-resize,w-resize,text,wait,help" defValue="" placeHolder="" name="cursor" htmlName="cursor"></div></td>
		[#--<td>{i18n_z_index}</td><td><div data-dojo-type='agile.NumberComboBox' class="peditor" name="zIndex" htmlName="z-index"></div></td>--]
		<td></td><td></td>
	</tr>
	<tr>
		<td title="{i18n_overflow_y_tooltip}" class="tooltip" nowrap>{i18n_overflow_y}</td>
		<td><div data-dojo-type='agile.NumberComboBox' class="peditor" options="visible,hidden,scroll,auto,no-display,no-content" name="overflowY" htmlName="overflow-y"></div></td>
		<td title="{i18n_vertical_align_tooltip}" class="tooltip">{i18n_vertical_align}</td>
		<td><div data-dojo-type='agile.NumberComboBox' class="peditor" options="baseline,sub,super,top,text-top,middle,bottom,text-bottom,0,0%" unit="px" defValue="" placeHolder="" name="verticalAlign" htmlName="vertical-align"></div></td>
		<td></td><td></td><td></td>
	</tr>
	</table>  
	[/#assign]
	templateString:"${templateString?js_string}"
[/@]
